{layout name="layout" /}
<div class="search-container">
    <form action="{:Url('user/index/search')}" method="get">
        <input type="text" name="keyword" value="{$keyword}" placeholder="请输入商品名称">
        <input type="submit" value="搜索">
    </form>
</div>

<div class="product-list-container">
    {empty name="products"}
        <p>没有找到相关商品</p>
    {/empty}
    {notempty name="products"}
        <p class="search-results">搜索 "{$keyword}" 的结果</p>
        <ul class="product-grid">
            {foreach name="products" item="data"}
            <li class="product-card">
                <a href="{:Url('user/index/detail',['id' => $data.pId])}" class="product-link" title="{$data.pName}">
                    <img src="__STATIC__/upload/{$data.pImg}" class="product-image" alt="{$data.pName}">
                    <div class="product-info">
                        <h3 class="product-name">{$data.pName|substr=0,20}</h3>
                        <p class="product-price">￥{$data.pPrice}</p>
                    </div>
                </a>
            </li>
            {/foreach}
        </ul>
    {/notempty}
</div>